window.onload = function() {
    // 页面加载完成后执行
    document.getElementById("submit").onclick = function() {
        // 点击提交按钮时执行的函数
        // 阻止表单提交
        // event.preventDefault();
 
        // 获取用户输入
        var username = document.getElementById('username').value;
        var pwd = document.getElementById('pwd').value;
        var checkpwd = document.getElementById('checkpwd').value;
        var mailbox = document.getElementById('mailbox').value;
        var phonenum = document.getElementById('phonenum').value;
        var code = document.getElementById('code').value;
 
        // 验证合法性并反馈给用户
        var warn = "";
 
        if (!isUsername(username)) {
            warn += "用户名不合法!\n";
        }
        if (!isPwd(pwd)) {
            warn += "密码不合法!\n";
        }
        if (pwd !== checkpwd) {
            warn += "两次密码不一致!\n";
        }
        if (!isPhone(phonenum)) {
            warn += "电话号码不合法!\n";
        }
        if (!isEmail(mailbox)) {
            warn += "邮箱地址不合法!\n";
        }
        if (!isCode(code)) {
            warn += "验证码必须是6位数字!\n";
        }
 
        // 如果有警告消息，弹出提示
        if (warn) {
            alert(warn);
            return false;
        } else {
            // 所有检查通过时提交表单
            document.getElementById('form').submit();
        }
    }
 
    // 失去焦点时的验证
    document.getElementById('username').onblur = validateUsername;
    document.getElementById('pwd').onblur = validatePassword;
    document.getElementById('checkpwd').onblur = validateCheckPassword;
    document.getElementById('phonenum').onblur = validatePhone;
    document.getElementById('mailbox').onblur = validateEmail;
    document.getElementById('code').onblur = validateCode;
}
 
// 验证用户名格式的函数
function isUsername(str) {
    // 正则表达式修正
    var reUsern = /^[a-zA-Z0-9_]{6,18}$/; // 6-18个字符的字母、数字和下划线
    return reUsern.test(str);
}
 
// 验证密码格式的函数
function isPwd(str) {
    // 正则表达式修正
    var pwdre = /^[a-zA-Z0-9_]{6,18}$/; // 6-18个字符的字母、数字和下划线
    return pwdre.test(str);
}
 
// 验证手机号码格式的函数
function isPhone(str) {
    var phone = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/; // 匹配11位数字的手机号码，包括常见的13、14、15、16、17、18、19开头的号段。
    return phone.test(str);
}
 
// 验证邮箱格式的函数
function isEmail(str) {
    var mail = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/; // Email格式
    
    return mail.test(str);
}
 
// 验证验证码格式的函数
function isCode(str) {
    var code = /^\d{6}$/; // 6位数字验证码
    return code.test(str);
}
 
// 验证函数
function validateUsername() {
    var username = document.getElementById('username').value;
    if (!isUsername(username)) {
        document.getElementById('namewarn').innerText = '\n用户必须是6-18位数字字母下划线';
        document.getElementById('namewarn').style.color = 'red';
    } else {
        document.getElementById('namewarn').innerText = '*';
        document.getElementById('namewarn').style.color = 'black';
    }
}
 
// 密码验证函数
function validatePassword() {
    var pwd = document.getElementById('pwd').value;
    if (!isPwd(pwd)) {
        document.getElementById('pwdwarn').innerText = '\n密码必须是6-18位数字字母下划线';
        document.getElementById('pwdwarn').style.color = 'red';
    } else {
        document.getElementById('pwdwarn').innerText = '*';
        document.getElementById('pwdwarn').style.color = 'black';
    }
}
 
// 确认密码验证函数
function validateCheckPassword() {
    var checkpwd = document.getElementById('checkpwd').value;
    var pwd = document.getElementById('pwd').value;
    if (pwd !== checkpwd) {
        document.getElementById('cpwarn').innerText = '\n两次密码不一致';
        document.getElementById('cpwarn').style.color = 'red';
    } else {
        document.getElementById('cpwarn').innerText = '*';
        document.getElementById('cpwarn').style.color = 'black';
    }
}
 
// 电话号码验证函数
function validatePhone() {
    var phonenum = document.getElementById('phonenum').value;
    if (!isPhone(phonenum)) {
        document.getElementById('phonewarn').innerText = '\n请输入真实电话号码';
        document.getElementById('phonewarn').style.color = 'red';
    } else {
        document.getElementById('phonewarn').innerText = '*';
        document.getElementById('phonewarn').style.color = 'black';
    }
}
 
// 电子邮件验证函数
function validateEmail() {
    var mailbox = document.getElementById('mailbox').value;
    if (!isEmail(mailbox)) {
        document.getElementById('emailwarn').innerText = '\n请输入有效的电子邮件地址';
        document.getElementById('emailwarn').style.color = 'red';
    } else {
        document.getElementById('emailwarn').innerText = '*';
        document.getElementById('emailwarn').style.color = 'black';
    }
}
 
// 验证码验证函数
function validateCode() {
    var code = document.getElementById('code').value;
    if (!isCode(code)) {
        document.getElementById('codewarn').innerText = '\n验证码必须是6位数字';
        document.getElementById('codewarn').style.color = 'red';
    } else {
        document.getElementById('codewarn').innerText = '*';
        document.getElementById('codewarn').style.color = 'black';
    }
}